<template>
  <div>
    <Form :model="searchForm" label-position="right" ref="searchForm" slot="adaption-bar" :label-width="100" inline>
      <!-- 资源编码 -->
      <Form-item prop="resourceCode" :label="$t('module.resourceManage.resCode')">
        <Input
          type="text"
          v-model.trim="searchForm.resourceCode"
          :placeholder="$t('module.resourceManage.enterCode')"
          @on-enter="search"
          @on-blur="codeToUpperCase"
        ></Input>
      </Form-item>

      <!-- 资源名称 -->
      <Form-item prop="resourceName" :label="$t('module.resourceManage.resName')">
        <Input
          type="text"
          v-model.trim="searchForm.resourceName"
          :placeholder="$t('module.resourceManage.enterName')"
          @on-enter="search"
        ></Input>
      </Form-item>
      <!-- 应用 -->
      <Form-item prop="enabled" :label="$t('module.resourceManage.application')" style="width:286px;">
        <Select
          v-model="searchForm.applicationId"
          filterable
          transfer
          clearable
          :placeholder="$t('module.resourceManage.selectApplication')"
        >
          <Option
            v-for="item in applicationList"
            :value="item.clientId"
            :key="item.clientId"
            :label="item.appName"
          ></Option>
        </Select>
      </Form-item>
      <!-- 查询\重置按钮 -->
      <Form-item prop="button" style="width:286px; text-align:right;">
        <RPButton optType="search" @click="search" style="background:#ff6f4b;" />
        <RPButton optType="reset" @click="reset" />
      </Form-item>
    </Form>
    <InnerPageTable ref="resourceTable" :config="tableConfig">
      <!-- table bar 添加-->
      <div slot="table-bar">
        <RPButton :text="$t('module.resourceManage.assignApiResource')" @click="add" />
        <RPButton optType="batch" @click="deleted" />
      </div>
    </InnerPageTable>
  </div>
</template>

<script>
import ResourceEdit from './ResourceEdit.vue'
import CopyResource from './CopyResource.vue'
import AssignResource from './AssignResource.vue'
import allApiResource from './allApiResource.vue'
import { pageMount, deleteResUnallocated } from '@/api/resourceApi.js'
import { getApplicationOfRoleAssigned } from '@/api/applicationApi.js'
import { getRolePostId } from '@/api/postApi.js'
import functionAPI from '@/api/functionAPI.js'
import { assignApiColumns } from './columns.js'
import { CoreModuleName } from '@/const.js'
import locales from './locales.js'

export default {
  mixins: [locales],
  props: {
    applicationId: {
      type: String,
      default() {
        return ''
      }
    },
    parentResourceId: {
      type: String,
      default() {
        return ''
      }
    }
  },
  data() {
    return {
      searchForm: {
        resourceCode: '',
        resourceName: '',
        resourceTypes: [2, 3],
        parentResourceId: this.parentResourceId,
        applicationId: this.applicationId
      },
      copyApplicationId: '',
      applicationList: [],
      actions: [
        // {
        //   text: this.$t("common.close"),
        //   theme: "primary",
        //   handle: () => {
        //     this.$emit("Close");
        //   }
        // }
      ]
    }
  },
  computed: {
    tableConfig() {
      return {
        loadDataFn: this.queryResouceList,
        columnsFn: assignApiColumns.bind(this),
        initParam: this.searchForm,
        autoFirst: true
      }
    },
    resourceType() {
      return [
        this.$t('module.resourceManage.uiResource'),
        this.$t('module.resourceManage.apiResource'),
        this.$t('module.resourceManage.functionalAuthority')
      ]
    }
  },
  created() {
    this.copyApplicationId = JSON.parse(JSON.stringify(this.applicationId))
    this.getAppList()
    this.init()
  },
  methods: {
    init() {
      this.$emit('SetTitle', this.$t('module.resourceManage.assignApiResource'))
      this.$emit('SetPageWidth', 700)
      this.$emit('SetPageMinHeight', 300)
      this.$emit('SetPageActions', this.actions)
    },
    getSelectedIds() {
      let list = this.$refs['resourceTable'].getSelectioned() || []
      let ids = []
      for (let u of list) {
        ids.push({ parentResourceId: this.parentResourceId, resourceId: u.id })
      }
      return ids
    },
    getAppList() {
      getApplicationOfRoleAssigned({ applicationCode: this.applicationId }).then(data => {
        this.applicationList = data.data
      })
    },

    search() {
      this.codeToUpperCase()
      this.$refs['resourceTable'].load(this.searchForm)
    },
    reset() {
      this.searchForm.application = ''
      this.searchForm.applicationId = this.copyApplicationId
      this.$refs['searchForm'].resetFields()
      this.search()
    },
    add() {
      new this.$pageModal(
        allApiResource,
        {
          props: {
            applicationList: this.applicationList,
            parentResourceId: this.parentResourceId,
            applicationId: this.applicationId
          }
        },
        data => {
          if (data) {
            this.search()
          }
        }
      )
    },
    deleted() {
      let selectedIds = this.getSelectedIds()
      if (selectedIds.length == 0) {
        this.$message.error({
          content: this.$t('module.resourceManage.selectDeletion'),
          duration: 3
        })
        return
      }
      deleteResUnallocated(selectedIds)
        .then(response => {
          this.$message.success({
            content: this.$t('common.deleteSuccess'),
            duration: 3
          })
          this.search()
        })
        .catch(data => {
          this.$message.error({
            content: data.message,
            duration: 3
          })
        })
    },
    queryResouceList({ responseProcess, param }) {
      //  筛选的时候，如果选择，全部applicationId为原始的applicationId
      if (param.applicationId == '0') {
        param.applicationId = null
        param.condition.applicationId = null
      }
      pageMount(param).then(data => {
        responseProcess(data.data)
      })
    },
    codeToUpperCase() {
      this.searchForm.resourceCode = this.searchForm.resourceCode.toUpperCase()
    }
  }
}
</script>

<style lang="less"></style>
